

<template>
  <div>
    <el-button class="butB_Sel" @click="printBtn()">打印1</el-button>
    <el-button class="butB_Sel" @click="printBtn2()">打印2</el-button>
    <div class="app-container" id="printcons" style="">
      <div
        class=""
        style="
          width: 1050px;
   height: 1450px;
          margin: auto;

          font-size: 14px;
        "
        v-for="(item2, index) in drug2"
        :key="index"
      >
        <div>
          <h2 style="text-align: center; margin: 0 5px">
            {{ his_name }}【{{ tabeldata.hospital_info.ipt_no }}】病人费用总清单
          </h2>

          <p style="width: 30%; float: left">
            起始时间:
            <span style="">{{ tabeldata.hospital_info.start_time }}</span>
          </p>
          <p style="width: 30%; float: left">
            停止时间:
            <span style="">{{ tabeldata.hospital_info.end_time }}</span>
          </p>
          <p style="width: 30%; float: left">
            出院时间:
            <span style="">{{ tabeldata.hospital_info.leave_time }}</span>
          </p>
          <table
            border="1"
            width="1050"
            align="center"
            cellspacing="0"
            cellpadding="0"
          >
            <tr style="height: 30px; padding: 0px; text-align: center">
              <td>住院号</td>
              <td>{{ tabeldata.hospital_info.ipt_no }}</td>
              <td>姓名</td>
              <td>{{ tabeldata.hospital_info.member.name }}</td>
              <td>性别</td>
              <td>
                {{
                  tabeldata.hospital_info.member.gender == 1
                    ? "男"
                    : tabeldata.hospital_info.member.gender == 2
                    ? "女"
                    : ""
                }}
              </td>
              <td>费用类别</td>
              <td>{{ tabeldata.hospital_info.show_nature }}</td>
              <td>入院时间</td>
              <td colspan="2">{{ tabeldata.hospital_info.begntime }}</td>
              <!-- <td rowspan="2" style="width: 320px; height: 30px">
                {{ type == "1" ? "长期医嘱" : "临时医嘱" }}
              </td>
              <td colspan="2">签名</td>

              <td colspan="2">停止</td>

              <td colspan="2">签名</td> -->
            </tr>
            <tr style="height: 30px; padding: 0px; text-align: center">
              <td style="">住院科室</td>
              <td>{{ tabeldata.hospital_info.department_name }}</td>

              <td>床号</td>

              <td>{{ tabeldata.hospital_info.bed_name }}</td>

              <td colspan="2">预交款</td>
              <td></td>
              <td>总费用</td>

              <td>{{ tabeldata.hospital_info.wallet.wallet_outcome }}</td>
              <td>总余额</td>

              <td>{{ tabeldata.hospital_info.wallet.wallet_money }}</td>
            </tr>
          </table>

          <table
            border="1"
            width="1050"
            align="center"
            cellspacing="0"
            cellpadding="0"
            v-for="(item, index2) in item2"
            :key="index2"
          >
            <tr
              v-if="index2 == 0"
              style="height: 30px; padding: 0px; text-align: center"
            >
              <td style="width: 110px">费用大类</td>
              <td style="width: 260px">编号</td>
              <td style="width: 320px">费用名称</td>

              <td style="width: 70px">甲乙类</td>

              <td style="width: 70px">单位</td>
              <td style="width: 70px">单价</td>
              <td style="width: 70px">数量</td>

              <td style="width: 70px">金额</td>
            </tr>
            <tr
              v-if="item.type2 == '1'"
              style="height: 30px; text-align: center; padding: 0px"
            >
              <td style="width: 110px">{{ item.cate_name }}</td>
              <td style="width: 260px">{{ item.no }}</td>

              <td style="width: 320px">{{ item.name }}</td>

              <td style="width: 70px">{{ item.type }}</td>

              <td style="width: 70px">
                {{ item.unit }}
              </td>
              <td style="width: 70px">
                {{ item.price }}
              </td>

              <td style="width: 70px">{{ item.number }}</td>
              <td style="width: 70px">{{ item.money }}</td>
            </tr>
            <tr
              style="text-align: center; height: 30px; padding: 0px"
              v-if="item.type2 == '2'"
            >
              <td colspan="8">{{ item.name }}小计：{{ item.cate_money }}</td>
            </tr>
          </table>
          <div
            style="
              height: 30px;
              width: 100%;
              border: 0.5px solid #000000;
              line-height: 30px;
              text-align: center;
              font-weight: 600;
            "
          >
            大写合计 {{ tabeldata.dx_cost }} 小写合计 {{ tabeldata.cost }}
          </div>
        </div>
        <p style="text-align: center">
          第{{ index + 1 }}页 /共 {{ drug2.length }} 页
          <span style="margin-left: 25px"
            >操作员:{{ tabeldata.create_by }}</span
          >
        </p>
        <!-- <p style="page-break-after: always;"></p> -->
      </div>
    </div>
  </div>
</template>
<script>
import { getdictIndex } from "@/api/register";
import { printHospitalFee } from "@/api/zhuyanre";
import print from "print-js";

export default {
  props: ["id"],
  data() {
    return {
      sourcelist: [],
      arrdata: [],
      drug2: [],
      dayin: false,
      tabeldata: {},
      feelist: [],

      his_name: process.env.VUE_APP_HOSPITAL_API,
    };
  },

  mounted() {
    this.tianjiaids2();
  },
  // watch: {
  //   id(n) {
  //     this.tianjiaids2();
  //   },
  // },
  methods: {
    tianjiaids2() {
      printHospitalFee({ hospital_id: this.id }).then((res) => {
        this.tabeldata = res.data;
        this.feelist = res.data.fee;
        this.scliplist(this.feelist);
      });
    },
    scliplist(list) {
      var datalist = [];
      for (let i in list) {
        var arr = list[i].lists;
        for (let j in arr) {
          arr[j].type2 = "1";
          arr[j].cate_name = list[i].cate_name;
          arr[j].cate_money = list[i].cate_money;
        }

        arr.push({
          money: list[i].cate_name,
          name: list[i].cate_name,
          cate_money: list[i].cate_money,

          no: "",
          number: "",
          price: "",
          type: "",
          type2: "2",
          unit: "",
        });
        datalist = datalist.concat(arr);
      }

    // this.drug2=  list.map(v=>{
    //     v.lists.map(v2=>{
    //         return {

    //         }
    //     })
    //     return {
         
    //     }
    //   })
       console.log("datalist",datalist);
      
      if (datalist.length > 30) {
        for (let it = 0; it < Math.ceil(datalist.length / 30); it++) {
          this.drug2.push(datalist.slice(it * 30, 30 * (it + 1)));
        }
      } else {
        this.drug2.push(datalist.slice(0, 30));
      }
      console.log("drig2", this.drug2);
      var aty = this.drug2[this.drug2.length - 1];
      var num = 30 - parseInt(aty.length);

      if (num < 30) {
        for (let i = 0; i < num; i++) {
          this.drug2[this.drug2.length - 1].push({
            money: '',
            name: '',
            no: "",
            number: '',
            price: "",
            type: "",
            type2: "1",
            unit: "",
          });
        }
      }
      console.log(this.drug2, "11111");
    },
    printBtn(e) {
      this.dayin = true;
      setTimeout(() => {
        this.dayinfun();
      }, 200);
    },
    printBtn2() {
      this.CreateOneFormPage();
    },
    CreateOneFormPage() {
      this.LODOP = getLodop();
      // this.LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_表单一");
      // this.LODOP.SET_PRINT_PAGESIZE(3,'21mm',0);
      //  this.LODOP.DO_ACTION("PREVIEW_ZOOM_WIDTH")
      // this.LODOP.SET_PRINT_STYLE("FontSize", 18);
      // this.LODOP.SET_PRINT_STYLE("Bold", 1);
      // LODOP.SET_PREVIEW_WINDOW(1,2,0,0,0,"预览查看.开始打印");

      // this.LODOP.ADD_PRINT_TEXT(50,231,260,39,"打印页面部分内容");
      this.LODOP.ADD_PRINT_HTM(
        50,
        30,
        "100%",
        "BottomMargin:9mm",
        document.getElementById("printcons").innerHTML
      );
      this.LODOP.PREVIEW();
    },
    dayinfun() {
      const style = "@page {margin:20mm 10mm};";
      setTimeout(function () {
        print({
          printable: "printcons", //打印区域id
          type: "html", //打印类型是html
          scanStyles: false,
          targetStyles: ["*"],
          style,
          documentTitle: "EFFORT",
          repeatTableHeader: true,
        });
      }, 500);
      // ————————————————
      // 版权声明：本文为CSDN博主「Fabricant」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
      // 原文链接：https://blog.csdn.net/Fabricant/article/details/119457914
      // this.remove_ie_header_and_footer();
      // let subOutputRankPrint = document.getElementById("printcons");
      // console.log(subOutputRankPrint.innerHTML);
      // let newContent = subOutputRankPrint.innerHTML;
      // let oldContent = document.body.innerHTML;
      // document.body.innerHTML = newContent;
      // window.print();
      //   window.location.reload();
      // this.$emit("reload");
      // document.body.innerHTML = oldContent;
      // return false;
    },
    //去掉页眉和页脚
    remove_ie_header_and_footer() {
      var hkey_path;
      hkey_path =
        "HKEY_CURRENT_USER\\Software\\Microsoft\\Internet Explorer\\PageSetup\\";
      try {
        var RegWsh = new ActiveXObject("WScript.Shell");
        RegWsh.RegWrite(hkey_path + "header", "");
        RegWsh.RegWrite(hkey_path + "footer", "");
      } catch (e) {}
    },
  },
};
</script>
<style media="print">
@page {
  size: auto; /* auto is the initial value */
  margin: 0mm; /* this affects the margin in the printer settings */
}
@media print {
}
body {
  -webkit-print-color-adjust: exact;
}
</style>
<style lang='scss' scoped>
</style>